<ul class="breadcrumb">
    <a href="<%=request.getContextPath() %>/project">PMT</a>
    <span class="divider">/</span></li>
    <li class="active">Product Backlog</li>
</ul>
<div style="margin-bottom:10px;">
    <a class="btn" href="#newItemModal" data-toggle="modal"><i class="icon-plus icon-black"></i> New Backlog Item</a>
</div>
<!-- modal -->
<div id="newItemModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-header">
        <h3>New Backlog Item</h3>
    </div>
    <div class="modal-body">
        <textarea style="width:92%; height: auto;"></textarea>
    </div>
    <div class="modal-footer">
        <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
        <button class="btn btn-primary">Save changes</button>
    </div>
</div>
<!--table class="table table-striped table-bordered">
    <thead>
        <tr>
            <th width="5%">NO.</td>
            <th width="95%">Product Backlog Items</td>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>1</td>
            <td class="backlog-item"><span>This is a test</span></td>
        </tr>
        <tr>
            <td>2</td>
            <td class="backlog-item"><span>This is a test</span></td>
        </tr>
        <tr>
            <td>3</td>
            <td class="backlog-item"><span>This is a test</span></td>
        </tr>
    </tbody>
</table-->
<div class="accordion" id="accordion2">
	<div class="accordion-group">
		<div class="accordion-heading">
			<table>
				<tbody>
					<tr>
						<td>
							<a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#accordion2" href="#collapseOne">
								Backlog Item One
							</a>
						</td>
						<td>99%</td>
					</tr>
				</tbody>
			</table>
		</div>
		<div id="collapseOne" class="accordion-body collapse">
			<div class="accordion-inner">
				<table class="table table-striped table-bordered">
					<thead>
						<tr>
							<th width="10%">Sprint</td>
							<th width="90%">Task</td>
						</tr>
					</thead>
					<tbody>
						<tr>
							<td>Sprint 1</td>
							<td class="backlog-item"><span>This is a test</span></td>
						</tr>
						<tr>
							<td>Sprint 2</td>
							<td class="backlog-item"><span>This is a test</span></td>
						</tr>
					</tbody>
				</table>
			</div>
		</div>
	</div>
	<!--Item two-->
	<div class="accordion-group">
		<div class="accordion-heading">
			<table>
				<tbody>
					<tr>
						<td>
							<a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#accordion2" href="#collapseTwo">
								Backlog Item One
							</a>
						</td>
						<td>99%</td>
					</tr>
				</tbody>
			</table>
		</div>
		<div id="collapseTwo" class="accordion-body collapse">
			<div class="accordion-inner">
				<table class="table table-striped table-bordered">
					<thead>
						<tr>
							<th width="10%">Sprint</td>
							<th width="90%">Task</td>
						</tr>
					</thead>
					<tbody>
						<tr>
							<td>Sprint 1</td>
							<td class="backlog-item"><span>This is a test</span></td>
						</tr>
						<tr>
							<td>Sprint 2</td>
							<td class="backlog-item"><span>This is a test</span></td>
						</tr>
					</tbody>
				</table>
			</div>
		</div>
	</div>
</div>